<script setup>
import { ref } from 'vue'
import { service } from '@utils'

const visible = ref(false)
const data = ref()

const open = (id, type) => {
    visible.value = true
    getData(id, type)
}

const close = () => {
    visible.value = false
    data.value = null
}

const getData = async (id, type) => {
    let res = null
    if (type === 1) {
        res = await service.mall.express(id)
    } else {
        res = await service.luck.express(id)
    }
    data.value = res
}

//把方法暴露给父组件
defineExpose({
    open
})
</script>

<template>
    <el-dialog v-model="visible" title="物流信息" center @close="close" destroy-on-close>
        <el-card v-if="data">
            <template #header>
                <div>
                    <span>{{data.expName}}</span>
                    <el-button class="button" text>{{data.number}}</el-button>
                </div>
            </template>
            <section style="max-height: 55vh; overflow-y: scroll;">
                <el-timeline v-if="data.list">
                    <el-timeline-item v-for="(item, index) in data.list" :key="index" :timestamp="item.time">
                        {{ item.status }}
                    </el-timeline-item>
                </el-timeline>
            </section>
        </el-card>
    </el-dialog>
</template>
